<template>
  <div class="page">
    <div class="goods_img">
      <img :src="result.picUrl" mode="widthFix">
    </div>
    <div class="goods_base">
      <div class="goods_base_title">{{result.actvContent}}</div>
      <div class="activity_info">
        <div><span class="grey">活动时间：</span>{{result.timeDesc}}</div>
        <div><span class="grey">适用条件：</span>{{result.ConditionData}}</div>
        <div><span class="grey">活动渠道：</span>{{result.useScenes}}</div>
        <div><span class="grey">适用门店：</span>{{merchantRange}}</div>
      </div>
    </div>
    <div class="weui-cells">
      <div class="weui-cell">
        <div class="weui-cell__bd">活动规则</div>
      </div>
      <div class="weui-cell">
        <div class="weui-cell__bd content" v-html="result.ruleContent">

        </div>
      </div>
    </div>
    <div class="weui-cells">
      <div class="weui-cell">
        <div class="weui-cell__bd">活动说明</div>
      </div>
      <div class="weui-cell">
        <div class="weui-cell__bd content">
          {{result.description}}
        </div>
      </div>
    </div>
    <div class="footer">
<!--      <a href="#">分享</a>-->
      <button open-type="share" data-name="pageShare" id="share" @click="onShareAppMessage">
        分享
      </button>
    </div>
  </div>
</template>

<script>
  import * as appId from "@/utils/util"
  import * as condition from "@/utils/options"
export default {
  data () {
    return {
      result:{},
      merchantRange:"",//适合门店
      id:""
    }
  },
  onLoad(id){
    console.log(id)
    this.id=id.id;
  },
  onShow(){
    wx.setNavigationBarTitle({
      title: "活动详情"
    })

     this.getDetail()
  },
    onShareAppMessage: function (res) {
        if (res.from === 'button') {
            // 来自页面内转发按钮
            console.log(res.target)
        }
        return {
            title: `${this.result.product.spName}`,     // 分享出去的标题
            path: "/pages/productdetail/main?id="+this.id,  // 分享之后再点进去的路径，可以带参数
            success: function (res) {
                wx.showToast({
                    title: '分享成功',
                    icon: 'none',
                    duration: 2000
                })
                // 转发成功
            },
            fail: function (res) {
                wx.showToast({
                    title: '分享失败',
                    icon: 'none',
                    duration: 2000
                })
                // 转发失败
            }
        }
    },
  methods: {
    receivingConditionVal(val){
      var str="";
      condition.condition.forEach((a,i)=>{
        if(a.value==val){
          str=a.label;
        }
      })
      return str;
    },
    getDetail(){
      let that=this;
      this.$http.request({
        method: "post",
        url: "/v1.0/appletHome/appletAssembleDetail",
        body: {
          id:that.id,
          status:'0'
        }
      }).then((data)=>{
        if(data.code==0){
          that.result=data.result;


          that.result.ConditionData=that.receivingConditionVal( that.result.receivingCondition)
          if(that.result.merchantRange){
            let merchantRange=JSON.parse(that.result.merchantRange)
            let arr=[];
            merchantRange.forEach((a,i)=>{
              arr.push(a.name)
            })
            console.log(arr)
            that.merchantRange=arr.join(',')
          }else{
            that.merchantRange=""
          }

        }else{
          wx.showToast({
            title: `${data.message}`,
            icon: 'none',
            duration: 2000
          })
        }
      })
    }
  },

  created () {
    // let app = getApp()
  }
}
</script>

<style scoped>
  .footer button{
    height: 2.4em;
    line-height: 2.4em;
    border-radius: 1.3em;
    color: #fff;
    text-align: center;
    font-size: 0.9em;
    background: #FF787E;
  }
  .footer button:after{
    border:none;
  }
.page{
  padding-bottom: 3.5em;
}
.content{
  font-size: 0.9em;
  color: #666;
}
.goods_img img{
  width: 100%;
}
.goods_base{
  background: #fff;
  padding: 0.8em;
}
.goods_base_title{
  font-size: 0.9em;
}
.goods_base_price{
  font-size: 0.8em;
}
.goods_base_price .price_now{
  color: #E4393C;
  font-size: 1.1em;
  padding-right: 0.4em;
}
.goods_base_price .price_old{
  color: #999;
  text-decoration: line-through;
  font-size: 0.9em;
}
.goods_base_price .grey{
  width: 6em;
  border-left: 1px #eee solid;
  text-align: right;
}
.goods_base_des{
  font-size: 0.8em;
  color: #999;
}
.footer{
  position: fixed;
  bottom: 0px;
  left: 0px;
  z-index: 9999;
  right: 0px;
  background: #fff;
  padding: 0.6em 2em;
  border-top: 1px #eee solid;
}
.footer a{
  height: 2.4em;
  line-height: 2.4em;
  border-radius: 1.3em;
  color: #fff;
  text-align: center;
  font-size: 0.9em;
  background: #FF787E;
}
.activity_info{
  font-size: 0.8em;
  line-height: 1.4em;
}
</style>
